.pure-stepper {
    display: var(--pure-stepper-display, inline-flex);
    flex-direction: var(--pure-stepper-flex-direction, row);
    align-items: var(--pure-stepper-align-items, center);
    justify-content: var(--pure-stepper-justify-content, space-between);
    gap: var(--pure-stepper-gap, 2px);
    line-height: var(--pure-stepper-line-height, 1);
    font-size: var(--pure-stepper-font-size, var(--pure-font-size-smaller));
    background: var(--pure-stepper-background);
    border: var(--pure-stepper-border, var(--pure-stepper-border-width, 0) var(--pure-stepper-border-style, solid) var(--pure-stepper-border-color));
    margin: var(--pure-stepper-margin);
    padding: var(--pure-stepper-padding);
    box-sizing: border-box;
    border-radius: var(--pure-stepper-border-radius, 2px);
    width: var(--pure-stepper-width);
    height: var(--pure-stepper-height, 2.5em);
}

.pure-stepper-button {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: var(--pure-stepper-button-width, var(--pure-stepper-height, 2.5em));
    height: var(--pure-stepper-button-height, 100%);
    background: var(--pure-stepper-button-background, var(--pure-background-light));
    border-radius: var(--pure-stepper-button-border-radius, inherit);
    box-sizing: border-box;
    border: var(--pure-stepper-button-border, var(--pure-stepper-button-border-width, 0) var(--pure-stepper-button-border-style, solid) var(--pure-stepper-button-border-color));
    padding: var(--pure-stepper-button-padding);
    margin: var(--pure-stepper-button-margin);
    font-size: var(--pure-stepper-button-font-size);
    cursor: var(--pure-stepper-button-cursor, pointer);
    color: var(--pure-stepper-button-color);
    font-weight: var(--pure-stepper-button-font-weight);
}

.pure-stepper-input {
    flex: 1;
    height: var(--pure-stepper-input-height, 100%);
    width: var(--pure-stepper-input-width, calc(var(--pure-stepper-height, 2.5em) * 2));
    text-align: var(--pure-stepper-input-text-align, center);
    --pure-input-height: 100%;
    background: var(--pure-stepper-input-background, var(--pure-background-light));
    border-radius: var(--pure-stepper-input-border-radius, inherit);
    box-sizing: border-box;
    border: var(--pure-stepper-input-border, var(--pure-stepper-input-border-width, 0) var(--pure-stepper-input-border-style, solid) var(--pure-stepper-input-border-color));
    padding: var(--pure-stepper-input-padding);
    margin: var(--pure-stepper-input-margin);
    outline: var(--pure-stepper-input-outline, none);
    font-size: var(--pure-stepper-input-font-size);
    color: var(--pure-stepper-input-color);
    font-weight: var(--pure-stepper-input-font-weight);
}

.pure-stepper-input-disabled {
    pointer-events: none;
    user-select: none;
}
